<script lang="ts" setup>
    import { ref } from 'vue';

    let name = ref("哈基羊")

    function updateName(){
                name.value = "哈基厅"
                console.log(name)
            }

    let img1 = ref("https://img2.baidu.com/it/u=37958264,2278279635&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1778")

    function updateimg(){
        img1.value = "https://gss0.baidu.com/7Po3dSag_xI4khGko9WTAnF6hhy/zhidao/wh%3D450%2C600/sign=7ea52b3276094b36dbc713e996fc50ef/63d0f703918fa0ec47f2b1e0269759ee3d6ddb22.jpg"
        console.log("111")
    }
</script>


<template>
  <h3>{{ name }}</h3>
  <button @click="updateName">改名</button>
   
   <img v-bind:src="img1" alt=""><br>
   <button @click="updateimg">改图片</button>
</template>



<style scoped>
    button{
        margin-bottom: 10px;
    }
</style>
